<template>
    <div>
        <el-dialog
                v-fullScreen
                title="M3"
                :visible.sync="visible"
                :close-on-click-modal="false"
                :append-to-body="true"
                width="30%"
                :modal="false"
                :modal-append-to-body="false"
                :z-index="1000"
        >
            <div class="el-dialog-div">
                <span v-for="i in 50" >
                    this is m3:{{i}}<br/>
                </span>
            </div>
        </el-dialog>
    </div>
</template>
<script >
    import M2 from "./M2.vue";
    export default {
        components: { M2},
        data(){
            return {
                visible:false,
            }
        },
        methods:{
            show(){
                this.visible=true;
            },
        }
    }
</script>
<style scoped>
    .el-dialog-div {
        height: 30vh;
        overflow: auto;
    }
    /* 关键：彻底移除遮罩相关样式 */
    ::v-deep  .el-dialog__wrapper {
        background: transparent !important; /* 透明背景 */
        pointer-events: none !important; /* 允许点击穿透 */
    }

    ::v-deep .el-dialog {
        background-color: rgba(255, 255, 255, 0.8) !important;
        pointer-events: auto !important; /* 弹窗本身可交互 */
        position: relative !important;
    }
</style>